<template>
    <div id="app">
        <!-- 面包屑 -->
        <div id="breadcrumb_box">
            <el-breadcrumb separator-class="el-icon-arrow-right">
                <el-breadcrumb-item>系统管理</el-breadcrumb-item>
                <el-breadcrumb-item><span id="current">用户管理</span></el-breadcrumb-item>
            </el-breadcrumb>
        </div>

        <el-card>
            <el-row>
                <el-col :span="22">
                    <span style="font-size: 16px; color: #2c9678; font-weight: 700;">
                        用户查询
                    </span>
                </el-col>
                <el-col :span="2">
                    <el-button icon="el-icon-search" font-family="wy" id="search" @click="search_user()">
                        查询
                    </el-button>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="8">
                    <span style="font-size: 15px">
                        用户id：
                    </span>
                    <el-input v-model="inquire.userId" placeholder="仅允许输入数字..." style="width: 300px"
                        onkeyup="value=value.replace(/[^\d]/g,'')" @keyup.enter.native="search_user()">
                    </el-input>
                </el-col>
                <el-col :span="8">
                    <span style="font-size: 15px">
                        用户名：
                    </span>
                    <el-input v-model="inquire.userName" placeholder="请输入..." style="width: 300px"
                        @keyup.enter.native="search_user()"></el-input>
                </el-col>
                <el-col :span="8">
                    <span style="font-size: 15px">
                        真实姓名：
                    </span>
                    <el-input v-model="inquire.realName" placeholder="请输入..." style="width: 300px"
                        @keyup.enter.native="search_user()"></el-input>
                </el-col>
            </el-row>
        </el-card>

        <list ref="child"></list>

        <!-- 弹窗 -->
        <el-dialog title="修改权限" :visible.sync="$store.state.Modify.userModify">
            <el-form>
                <el-form-item label="用户管理权限：" :label-width="'300px'">
                    <el-radio-group v-model="$store.state.Modify.row.isUserManage">
                        <el-radio :label="true" border>✔</el-radio>
                        <el-radio :label="false" border>✘</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="商品管理权限：" :label-width="'300px'">
                    <el-radio-group v-model="$store.state.Modify.row.isGoodsManage">
                        <el-radio :label="true" border>✔</el-radio>
                        <el-radio :label="false" border>✘</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="库存管理权限：" :label-width="'300px'">
                    <el-radio-group v-model="$store.state.Modify.row.isInventoryManage">
                        <el-radio :label="true" border>✔</el-radio>
                        <el-radio :label="false" border>✘</el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-form>

            <div slot="footer" class="dialog-footer">
                <el-button type="primary" id="submit" @click="modify_user()">确 定</el-button>
            </div>
        </el-dialog>

        <el-dialog :visible.sync="$store.state.Delete.userDelete" width="30%">
            <span>确定删除该用户？</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="$store.state.Delete.userDelete = false">取 消</el-button>
                <el-button type="danger" @click="delete_user()">确 定</el-button>
            </span>
        </el-dialog>

    </div>
</template>

<script src="../../assets/js/admin/user_manage.js">
</script>

<style scoped src="../../assets/css/admin/manage.css">
</style>